import {
    Component, Input, SimpleChanges
} from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

@Component({
    selector: 'custom-img',
    templateUrl: './slider-custom-image.component.html'
})
export class SliderCustomImageComponent {

    fileUrl: SafeResourceUrl = '';
    imageLoading:boolean = true;

    @Input() imageUrl: string ='';
    @Input() ratio: boolean = false;
    @Input() speed: number = 1;

    constructor(
        private sanitizer: DomSanitizer,
    ) {
    }

    ngOnChanges(changes: SimpleChanges) {
        if(this.imageUrl
            && (changes.imageUrl && changes.imageUrl.firstChange)){
                this._setUrl();
            }
    }

    private _setUrl(){
        const url = this.imageUrl;
        this.fileUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);
    }
}
